<template>
    <div id="addCase">
        <div class="addCase_content">
            <h3 class="infoList_title">新增方案</h3>
            <div class="moshi">
                <el-radio v-model="modelType" label="1">简单模式</el-radio>
                <el-radio v-model="modelType" label="2">专家模式</el-radio>
            </div>
            <el-divider></el-divider>
            <div class="case_title">
                <span class="case_title_text">方案名称</span>
                <el-input v-model="caseTitle" placeholder="输入方案名称"></el-input>
            </div>
            
            <!-- 地域关键词开始 -->
            <div class="case_title" v-if="modelType == '1'">
                <span class="case_title_text">地域关键词</span>
                <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入地理关键词，多个以空格分开。（如北京 东城区）"
                v-model="caseArea">
                </el-input>
            </div>
            <div class="case_relation" v-if="modelType == '1'">
                <span class="case_title_text">地理关系：</span>
                <el-radio-group v-model="areaRelation" size="mini">
                    <el-radio-button label=1>与</el-radio-button>
                    <el-radio-button label=0>或</el-radio-button>
                </el-radio-group>
                <span class="case_tip">（注意：地域、人物、事件关键词不能同时为空）</span>
            </div>
            <!-- 地域关键词结束 -->
             <!-- 人物关键词开始 -->
            <div class="case_title" v-if="modelType == '1'" style="margin-top: 30px;">
                <span class="case_title_text">人物关键词</span>
                <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入人物关键词，多个以空格分开。（如王五 张三）"
                v-model="casePeople">
                </el-input>
            </div>
            <div class="case_relation" v-if="modelType == '1'">
                <span class="case_title_text">人物关系：</span>
                <el-radio-group v-model="peopleRelation" size="mini">
                    <el-radio-button label=1>与</el-radio-button>
                    <el-radio-button label=0>或</el-radio-button>
                </el-radio-group>
                <span class="case_tip">（注意：地域、人物、事件关键词不能同时为空）</span>
            </div>
            <!-- 人物关键词结束 -->
            <!-- 事件关键词开始 -->
            <div class="case_title" v-if="modelType == '1'" style="margin-top: 30px;">
                <span class="case_title_text">事件关键词</span>
                <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入事件关键词，多个以空格分开。（如打人 变质）"
                v-model="caseEvent">
                </el-input>
            </div>
            <div class="case_relation" v-if="modelType == '1'">
                <span class="case_title_text">事件关系：</span>
                <el-radio-group v-model="eventRelation" size="mini">
                    <el-radio-button label=1>与</el-radio-button>
                    <el-radio-button label=0>或</el-radio-button>
                </el-radio-group>
                <span class="case_tip">（注意：地域、人物、事件关键词不能同时为空）</span>
            </div>
            <!-- 事件关键词结束 -->
            <!-- 排除关键词开始 -->
            <div class="case_title" v-if="modelType == '1'" style="margin-top: 30px;">
                <span class="case_title_text">排除关键词</span>
                <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入排除关键词，多个以空格分开。（如上班 下班）"
                v-model="caseExclude">
                </el-input>
            </div>
            <div class="case_relation" v-if="modelType == '1'">
                <span class="case_tip">（注意：排除关键词只支持或运算，总次数请保持在1000字以内，已输入0个字，还可输入1000个字）</span>
            </div>
            <!-- 排除关键词结束 -->
            <!-- 专家模式匹配关键词开始 -->
            <div v-if="modelType == '2'" class="case_title">
                <span class="case_title_text">匹配关键词</span>
                <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入匹配关键词。（如北京+东城区，或者北京|东城区）"
                v-model="expertMatch">
                </el-input>
            </div>
            <div v-if="modelType == '2'" class="case_relation">
                <el-button type="primary" size="mini" @click="matchRule('+')">+</el-button>
                <el-button type="primary" size="mini" @click="matchRule('|')">|</el-button>
                <el-button type="primary" size="mini" @click="matchRule('(')">(</el-button>
                <el-button type="primary" size="mini" @click="matchRule(')')">)</el-button>
                <span class="case_tip">（匹配关键词总字数在1000字以内，已输入0个字，还可输入1000个字）</span>
            </div>
            <!-- 专家模式匹配关键词结束 -->
             <!-- 专家模式排除关键词开始 -->
            <div v-if="modelType == '2'" class="case_title" style="margin-top: 30px;">
                <span class="case_title_text">排除关键词</span>
                <el-input
                type="textarea"
                :rows="4"
                placeholder="请输入主体关键词，多个以空格分开。（如王五 张三）"
                v-model="caseExclude2">
                </el-input>
            </div>
            <div v-if="modelType == '2'" class="case_relation">
                <el-button type="primary" size="mini" @click="excludeRule('+')">+</el-button>
                <el-button type="primary" size="mini" @click="excludeRule('|')">|</el-button>
                <el-button type="primary" size="mini" @click="excludeRule('(')">(</el-button>
                <el-button type="primary" size="mini" @click="excludeRule(')')">)</el-button>
                <span class="case_tip">（注意：主体关键词只支持一层嵌套，总字数不超过1000字，已输入0个字，还可输入1000字）</span>
            </div>
            <!-- 专家模式排除关键词结束 -->
            <div class="btnGroup">
                <span style="color:red;font-size:14px;display:block;">{{tipInfo}}</span>
                <!-- <el-button type="primary" class="backBtn">返回信息列表</el-button> -->
                <el-button type="primary" class="saveBtn" @click="saveCase">保存</el-button>
            </div>
        </div>
    </div>
</template>
<script>
import '../../assets/css/addCase.css'
export default {
    data(){
        return{
            tipInfo: '',
            modelType: '1', // 简单模式/专家模式
            caseTitle: '', // 方案名称
            caseArea: '', // 
            areaRelation:0,
            casePeople: '',
            peopleRelation: 0,
            caseEvent: '',
            eventRelation: 0,
            caseExclude: '', // 简单模式排除关键词
            expertMatch: '', // 匹配关键词
            caseExclude2: '' // 专家模式排除关键词
        }
    },
    methods:{
        saveCase(){
            let param = {}
            if(this.caseTitle == ''){
                this.tipInfo = '方案名称不能为空'
                 return   
            }else{
                this.tipInfo = ''
            }
            param.schemeName = this.caseTitle;
            param.schemeType = this.modelType;
            if(this.modelType == '1'){
                param.regionWord = this.caseArea; // 地域关键词
                param.regionRelation = this.areaRelation; // 地理关系
                param.characterWord = this.casePeople; // 人物关键词
                param.characterRelation = this.peopleRelation; // 人物关系
                param.eventWord = this.caseEvent; // 事件关键词
                param.eventRelation = this.eventRelation; // 事件关系
                param.excludeWord = this.caseExclude; //排除关键词
                param.matchWord = ''; // 匹配关键词
                if(this.caseArea == '' && this.casePeople=='' && this.caseEvent == ''){
                    this.tipInfo = '地域、人物、事件关键词不能同时为空'
                    return
                }else{
                    this.tipInfo = ''
                }
            }else{
                param.regionWord = ''; // 地域关键词
                param.regionRelation = ''; // 地理关系
                param.characterWord = ''; // 人物关键词
                param.characterRelation = ''; // 人物关系
                param.eventWord = ''; // 事件关键词
                param.eventRelation = ''; // 事件关系
                param.matchWord = this.expertMatch; // 匹配关键词
                param.excludeWord = this.caseExclude2; //排除关键词
            }
            this.$Api.addScheme(param).then(res => {
               console.log(res);
                if(res.code == '200'){
                    this.refreshAside()
               }
            })
        },
        refreshAside(){
            this.$Api.getInfo().then((res) => {
                this.$store.commit('setUserData', res);
                this.$router.replace('/addCase')
            })
        },
        matchRule(rule){
            this.expertMatch = this.expertMatch + rule;
        },
        excludeRule(rule){
            this.caseExclude2 = this.caseExclude2 + rule;
        }
    },
    watch:{
        modelType(val){
            console.log(val)
        }
    }
}
</script>
